<wicket:panel>
	<div wicket:id="container" class="markdown-editor autofit no-autosize name-changing-listener">
		<div class="head">
			<div class="actions clearfix">
				<div class="pull-left normal-mode clearfix">
					<a class="do-bold pull-left" title="Bold"><i class="fa fa-bold"></i></a>
					<a class="do-italic pull-left" title="Italic"><i class="fa fa-italic"></i></a>
					<a class="do-header pull-left" title="Heading"><i class="fa fa-header"></i></a>
					<span class="separator pull-left"></span>
					<a class="do-link pull-left" title="Link (Ctrl-L)"><i class="fa fa-link"></i></a>
					<a class="do-image pull-left" title="Image (Ctrl-I)"><i class="fa fa-picture-o"></i></a>
					<span class="separator pull-left"></span>
					<a class="do-list pull-left" title="Unordered list"><i class="fa fa-list"></i></a>
					<a class="do-orderlist pull-left" title="Ordered list"><i class="fa fa-list-ol"></i></a>
					<a class="do-tasklist pull-left" title="Task list"><i class="fa fa-check-square-o"></i></a>
					<a class="do-code pull-left" title="Code"><i class="fa fa-code"></i></a>
					<a class="do-quote pull-left" title="Quote"><i class="fa fa-quote-left"></i></a>
					<span class="separator pull-left"></span>
					<a class="do-emoji pull-left" title="Show emojis"><i class="fa fa-smile-o"></i></a>
					<a class="do-mention pull-left" title="Mention someone"><i class="fa fa-at"></i></a>
					<a class="do-hashtag pull-left" title="Reference pull request/issue"><i class="fa fa-hashtag"></i></a>
				</div>
				<div class="pull-left dropdown compact-mode">
					<a data-toggle="dropdown" type="button"><i class="fa fa-chevron-down"></i></a>
					<ul class="dropdown-menu" aria-labelledby="dLabel">
						<li><a class="do-bold"><i class="fa fa-bold fa-fw"></i> Bold</a></li>
				    	<li><a class="do-italic"><i class="fa fa-italic fa-fw"></i> Italic</a></li>
						<li><a class="do-header"><i class="fa fa-header fa-fw"></i> Heading</a></li>
						<li role="separator" class="divider"></li>
						<li><a class="do-link"><i class="fa fa-link fa-fw"></i> Link <span class="pull-right">Ctrl-L</span></a></li>
						<li><a class="do-image"><i class="fa fa-picture-o fa-fw"></i> Image <span class="pull-right">Ctrl-I</span></a></li>
						<li role="separator" class="divider"></li>
						<li><a class="do-list"><i class="fa fa-list fa-fw"></i> Unordered List</a></li>
						<li><a class="do-orderlist"><i class="fa fa-list-ol fa-fw"></i> Ordered List</a></li>
						<li><a class="do-tasklist"><i class="fa fa-check-square-o fa-fw"></i> Task List</a></li>
						<li><a class="do-code"><i class="fa fa-code fa-fw"></i> Code</a></li>
						<li><a class="do-quote"><i class="fa fa-quote-left fa-fw"></i> Quote</a></li>
						<li role="separator" class="divider"></li>
						<li><a class="do-emoji"><i class="fa fa-smile-o fa-fw"></i> Show Emojis</a></li>
						<li><a class="do-mention"><i class="fa fa-at fa-fw"></i> Mention Someone</a></li>
						<li><a class="do-hashtag"><i class="fa fa-hashtag fa-fw"></i> Reference Pull Request/Issue</a></li>
					</ul>
				</div>
				<div class="pull-right clearfix">
					<a class="do-fullscreen pull-left" title="Full screen"><i class="fa fa-expand"></i></a>
					<a class="do-help pull-left" title="Help"><i class="fa fa-question"></i></a>
					<span class="separator pull-left"></span>
					<a wicket:id="editLink" class="edit pull-left" title="Edit"><i class="fa fa-font"></i></a>
					<a class="preview pull-left" title="Preview"><i class="fa fa-eye"></i></a>
					<a wicket:id="splitLink" class="split pull-left" title="Split view"><i wicket:id="icon" class="fa fa-columns"></i></a>
				</div>						
			</div>			
			<div class="warning alert alert-warning">
				<a class="close" data-dismiss="alert"><span>&times;</span></a>
				<div class="message"><i class="fa fa-warning"></i> Below content is restored from an unsaved change</div>
			</div>
			<div class="emojis"></div>
			<div class="help">
				<a href="https://guides.github.com/features/mastering-markdown/" target="_blank">GitHub flavored markdown</a> is accepted. 
				<span wicket:id="canAttachFile">You may drop file/image to the input box, or paste image from clipboard</span>
			</div>
		</div>
		<div class="body clearfix">
			<div wicket:id="edit" class="edit">
				<textarea wicket:id="input"></textarea>
				<div class="ui-resizable-handle ui-resizable-s"></div>
			</div>
			<div wicket:id="preview" class="preview">
				<div wicket:id="rendered" class="markdown-rendered"></div>
				<div class="ui-resizable-handle ui-resizable-s"></div>
			</div>
		</div>
	</div>
</wicket:panel>